import React, { useEffect } from 'react'
import { Button } from 'antd'
import { useNavigate } from 'react-router-dom'
import NotNetworkIcon from '@/assets/images/notNetwork.png'


const NotNetwork = () => {
  const navigate = useNavigate()
  const handleReLoad = () => {
    if (window.navigator.onLine) {
      navigate(-1)
    }
  }
  useEffect(() => {
    handleReLoad()
  }, [])

  return (
    <div
      style={{ height: '100vh', width: '100vw', display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center' }}>
      <img src={NotNetworkIcon} style={{ width: 323, height: 280 }} />
      <div style={{ fontSize: 30, marginTop: 78, color: '#9E9E9E' }}>页面加载失败</div>
      <div style={{ fontSize: 24, margin: '33px 0px 55px', color: '#9E9E9E' }}>请检查你的网络设置，或联系公司的技术人员</div>
      <Button type={'primary'} onClick={handleReLoad}>
        重新加载
      </Button>
    </div>
  )
}

export default NotNetwork
